<template>
  <div id="purchase">
    <div class="top">
      <div class="gou">
        <img src="../../assets/goumaichengong.png" alt="购物成功">
        <p>补货完成</p>
      </div>
    </div>
    <div class="btn">完成</div>
    <div class="bottom">
      <h4>感谢您的付出，您辛苦了~</h4>
      <img src="../../assets/xiaolian.png" alt="">
      <img src="../../assets/lanlv.png" alt="">
      <!-- <div class="lan">
        <div class="xx"></div>
        <span>蓝驴生活</span>
        <div class="xx"></div>
      </div> -->
    </div>
  </div>
</template>

<script>
export default {
  name: 'Purchase',
  created () {
    document.title = '购买成功'
  }
}
</script>

<style lang='scss' scoped>
#purchase{
  width: 100%;
  height: 100%;
  background-color: #fff;
  padding: 0 3.46vw;
  box-sizing: border-box;
  .top{
    height: 50.66vw;
    display: flex;
    justify-content: center;
    align-items: center;
    .gou{
      height: 24vw;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      img{
        width: 13.06vw;
        height: 13.06vw;
      }
      p{
        font-size: 5.6vw;
        font-family:SourceHanSansCN-Bold;
        font-weight:bold;
        color:rgba(22,22,22,1);
      }
    }
  }
  .btn{
    width: 93.06vw;
    height: 12.26vw;
    background:rgba(10,109,255,1);
    text-align: center;
    line-height: 12.26vw;
    border-radius: 0.8vw;
    font-size: 4.53vw;
    font-family:SourceHanSansCN-Normal;
    font-weight:400;
    color:rgba(255,255,255,1);
  }
  .bottom{
    width: 93.06vw;
    height: 62.93vw;
    margin-top: 13.33vw;
    background:rgba(255,255,255,1);
    box-shadow:0px 2px 4vw 1.06vw rgba(0,0,0,0.06);
    border-radius: 0.8vw;
    padding: 8vw 3.46vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    h4{
      font-size: 4.53vw;
      font-family:SourceHanSansCN-Bold;
      font-weight:bold;
      color:rgba(22,22,22,1);
    }
    img{
      &:nth-of-type(1){
        width: 13.86vw;
        height: 13.86vw;
        margin: 12vw 0vw;
      }
      &:nth-of-type(2){
        width: 93.06vw;
        height: 4.53vw;
      }
    }
  }
}
</style>
